<template>
  <div class="zong">
    <van-nav-bar
      @click-left="$router.back(-1)"
      style="width: 100%"
      title="宠物保险"
      left-text="返回"
      left-arrow
    >
    </van-nav-bar>
    <div class="center">
      <div class="pic">
        <img src="/bs.jpg" alt="" />
        <img src="/bx.jpg" alt="" />
      </div>
      <div class="text">
        <h2>宠物医疗险</h2>
        <p>报销犬猫看病的高昂费用，用额外赠送超值贴心服务。根据不同险</p>
        <p>种的保障范围，为自家毛孩子挑选合适的保险喔~</p>
      </div>
      <div class="nr">
        <van-card
          price="345元|年起"
          desc="高发疾病报销|诊疗费用赔付高达60%"
          title="人保 . 爱宠宠医保"
          thumb="/3.jpg"
        />
        <van-card
          price="345元|年起"
          desc="高发疾病报销|诊疗费用赔付高达60%"
          title="人保 . 爱宠宠医保"
          thumb="/3.jpg"
        />
        <van-card
          price="345元|年起"
          desc="高发疾病报销|诊疗费用赔付高达60%"
          title="人保 . 爱宠宠医保"
          thumb="/3.jpg"
        />
        <van-card
          price="345元|年起"
          desc="高发疾病报销|诊疗费用赔付高达60%"
          title="人保 . 爱宠宠医保"
          thumb="/3.jpg"
        />
      </div>
    </div>
  </div>
</template>

<script>
export default {};
</script>

<style lang="scss" scoped>
.center {
  width: 375px;
  margin: 0 auto;
}
.zong {
  background-color: #80c0fe;
}
.van-card__price-integer,
.van-card__price-currency {
  color: #f00;
}

.pic {
  margin-bottom: 50px;
  > img {
    display: block;
    width: 100%;
  }
}
.text {
  > h2 {
    font-size: 20px;
    margin-bottom: 8px;
  }
  > p {
    font-size: 12px;
    margin-bottom: 3px;
  }
}
.nr {
  margin-bottom: 50px;
  background-color: #fff;
}
</style>
